/**
 * 权限控制指令和组件
 */
import { useAuthStore } from '../store/auth'

// 权限控制指令
export const permission = {
  mounted(el, binding) {
    const authStore = useAuthStore()
    const { value } = binding
    
    if (!value) return
    
    let hasPermission = false
    
    if (Array.isArray(value)) {
      // 多个权限，需要全部满足
      hasPermission = value.every(permission => authStore.hasPermission(permission))
    } else if (typeof value === 'string') {
      // 单个权限
      hasPermission = authStore.hasPermission(value)
    } else if (typeof value === 'object') {
      // 对象形式：{ permission: 'xxx', role: 'xxx' }
      if (value.permission) {
        hasPermission = authStore.hasPermission(value.permission)
      }
      if (value.role) {
        hasPermission = hasPermission && authStore.hasRole(value.role)
      }
    }
    
    if (!hasPermission) {
      el.style.display = 'none'
    }
  },
  
  updated(el, binding) {
    // 权限变化时重新检查
    permission.mounted(el, binding)
  }
}

// 角色控制指令
export const role = {
  mounted(el, binding) {
    const authStore = useAuthStore()
    const { value } = binding
    
    if (!value) return
    
    let hasRole = false
    
    if (Array.isArray(value)) {
      // 多个角色，满足其中一个即可
      hasRole = value.some(role => authStore.hasRole(role))
    } else if (typeof value === 'string') {
      // 单个角色
      hasRole = authStore.hasRole(value)
    }
    
    if (!hasRole) {
      el.style.display = 'none'
    }
  },
  
  updated(el, binding) {
    // 角色变化时重新检查
    role.mounted(el, binding)
  }
}

// 权限控制组件
export const PermissionWrapper = {
  name: 'PermissionWrapper',
  props: {
    permission: {
      type: [String, Array, Object],
      default: null
    },
    role: {
      type: [String, Array],
      default: null
    },
    fallback: {
      type: String,
      default: ''
    }
  },
  setup(props, { slots }) {
    const authStore = useAuthStore()
    
    const hasAccess = () => {
      let hasPermission = true
      let hasRole = true
      
      // 检查权限
      if (props.permission) {
        if (Array.isArray(props.permission)) {
          hasPermission = props.permission.every(p => authStore.hasPermission(p))
        } else if (typeof props.permission === 'string') {
          hasPermission = authStore.hasPermission(props.permission)
        } else if (typeof props.permission === 'object') {
          if (props.permission.permission) {
            hasPermission = authStore.hasPermission(props.permission.permission)
          }
          if (props.permission.role) {
            hasPermission = hasPermission && authStore.hasRole(props.permission.role)
          }
        }
      }
      
      // 检查角色
      if (props.role) {
        if (Array.isArray(props.role)) {
          hasRole = props.role.some(r => authStore.hasRole(r))
        } else if (typeof props.role === 'string') {
          hasRole = authStore.hasRole(props.role)
        }
      }
      
      return hasPermission && hasRole
    }
    
    return () => {
      if (hasAccess()) {
        return slots.default?.()
      } else if (props.fallback) {
        return props.fallback
      } else {
        return null
      }
    }
  }
}

// 权限按钮组件
export const PermissionButton = {
  name: 'PermissionButton',
  props: {
    permission: {
      type: [String, Array, Object],
      default: null
    },
    role: {
      type: [String, Array],
      default: null
    },
    disabled: {
      type: Boolean,
      default: false
    },
    type: {
      type: String,
      default: 'default'
    },
    size: {
      type: String,
      default: 'default'
    },
    icon: {
      type: [String, Object],
      default: null
    },
    loading: {
      type: Boolean,
      default: false
    }
  },
  emits: ['click'],
  setup(props, { slots, emit }) {
    const authStore = useAuthStore()
    
    const hasAccess = () => {
      let hasPermission = true
      let hasRole = true
      
      // 检查权限
      if (props.permission) {
        if (Array.isArray(props.permission)) {
          hasPermission = props.permission.every(p => authStore.hasPermission(p))
        } else if (typeof props.permission === 'string') {
          hasPermission = authStore.hasPermission(props.permission)
        } else if (typeof props.permission === 'object') {
          if (props.permission.permission) {
            hasPermission = authStore.hasPermission(props.permission.permission)
          }
          if (props.permission.role) {
            hasPermission = hasPermission && authStore.hasRole(props.permission.role)
          }
        }
      }
      
      // 检查角色
      if (props.role) {
        if (Array.isArray(props.role)) {
          hasRole = props.role.some(r => authStore.hasRole(r))
        } else if (typeof props.role === 'string') {
          hasRole = authStore.hasRole(props.role)
        }
      }
      
      return hasPermission && hasRole
    }
    
    const handleClick = (event) => {
      if (hasAccess() && !props.disabled && !props.loading) {
        emit('click', event)
      }
    }
    
    return () => {
      if (!hasAccess()) {
        return null
      }
      
      return (
        <el-button
          type={props.type}
          size={props.size}
          disabled={props.disabled}
          loading={props.loading}
          onClick={handleClick}
        >
          {props.icon && <el-icon><component is={props.icon} /></el-icon>}
          {slots.default?.()}
        </el-button>
      )
    }
  }
}

// 权限表格列组件
export const PermissionTableColumn = {
  name: 'PermissionTableColumn',
  props: {
    permission: {
      type: [String, Array, Object],
      default: null
    },
    role: {
      type: [String, Array],
      default: null
    },
    prop: {
      type: String,
      default: ''
    },
    label: {
      type: String,
      default: ''
    },
    width: {
      type: [String, Number],
      default: null
    },
    minWidth: {
      type: [String, Number],
      default: null
    },
    fixed: {
      type: [Boolean, String],
      default: false
    },
    sortable: {
      type: [Boolean, String],
      default: false
    },
    align: {
      type: String,
      default: 'left'
    }
  },
  setup(props) {
    const authStore = useAuthStore()
    
    const hasAccess = () => {
      let hasPermission = true
      let hasRole = true
      
      // 检查权限
      if (props.permission) {
        if (Array.isArray(props.permission)) {
          hasPermission = props.permission.every(p => authStore.hasPermission(p))
        } else if (typeof props.permission === 'string') {
          hasPermission = authStore.hasPermission(props.permission)
        } else if (typeof props.permission === 'object') {
          if (props.permission.permission) {
            hasPermission = authStore.hasPermission(props.permission.permission)
          }
          if (props.permission.role) {
            hasPermission = hasPermission && authStore.hasRole(props.permission.role)
          }
        }
      }
      
      // 检查角色
      if (props.role) {
        if (Array.isArray(props.role)) {
          hasRole = props.role.some(r => authStore.hasRole(r))
        } else if (typeof props.role === 'string') {
          hasRole = authStore.hasRole(props.role)
        }
      }
      
      return hasPermission && hasRole
    }
    
    return () => {
      if (!hasAccess()) {
        return null
      }
      
      return (
        <el-table-column
          prop={props.prop}
          label={props.label}
          width={props.width}
          minWidth={props.minWidth}
          fixed={props.fixed}
          sortable={props.sortable}
          align={props.align}
        />
      )
    }
  }
}
